<script setup>
	import {
		ref
	} from 'vue';

	const db = uniCloud.database();
	const formData = ref({
		name: "",
		age: "",
		avatar: []
	})
	const handleAdd = async () => {
		uni.showLoading({
			title: "新增中..."
		})

		try {
			let res = await db.collection("demo-user").add(formData.value);
			if (res.result.errCode === 0) {
				console.log(res);
				uni.showToast({
					title: "新增成功..."
				})
				formData.value = {
					name: "",
					age: "",
					avatar: []
				}
			}
		} catch (err) {
			uni.showModal({
				content: err.errMsg || "新增失败",
				showCancel: false
			})
		} finally {
			uni.hideLoading()
		}
	}
	// 	db.collection("demo-user").add([
	// 	{
	// 		name: "abc",
	// 		age:23
	// 	},
	// 	{
	// 		name: "def",
	// 		age:24
	// 	},
	// 	]).then(res => {
	// 		console.log(res);
	// 	}).catch(err => {
	// 		uni.showModal({
	// 			content: err.errMsg,
	// 			showCancel: false
	// 		})
	// 	}).finally(()=>{
	// 		uni.hideLoading()
	// 	})
</script>
<template>
	<view class="layout">
		<uni-file-picker v-model="formData.avatar" mode="grid" fileMediatype="image" limit="1"></uni-file-picker>
		<input v-model="formData.name" placeholder="请输入姓名" />
		<input v-model="formData.age" placeholder="请输入年龄" />
		<button @click="handleAdd">新增</button>
	</view>
</template>
<style lang="scss" scoped>
	.layout {
		padding: 30rpx;

		input {
			border: 1px solid #eee;
			margin-bottom: 30rpx;
			height: 80rpx;
			padding: 0 20;
			margin-top: 30rpx;
		}
	}
</style>